import 'package:common/common.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:miaowu/app/module/miao_pond/pond_list/pond_list_view.dart';
import 'package:miaowu/app/module/miao_pond/publish/pond_publish_mian_widget.dart';
import 'package:miaowu/app/module/mine/setting/setting_page.dart';

class HomePage extends StatefulWidget {
  const HomePage({super.key, required this.title});
  final String title;
  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  @override
  Widget build(BuildContext context) {
    double itemWidth = (MediaQuery.of(context).size.width - 16.w * 2 - 14.w) / 2;
    return Scaffold(
      backgroundColor: const Color(0xFF0C183A).withOpacity(0),
      body: Column(
        children: <Widget>[
          Container(color: Colors.transparent, height: MediaQuery.of(context).viewPadding.top),
          _buildAppBarWarpper(),
          const Spacer(),
          _buildMessageNoticeNumberWarpper(),
          _buildMenuWarpper(itemWidth),
          Container(height: 20) // MediaQuery.of(context).viewPadding.bottom
        ],
      ),
      floatingActionButton: TextButton(
          onPressed: () {
            Get.to(const SettingPage());
          },
          child: Container(
            width: 40,
            height: 40,
            color: Colors.amber,
          )),
    );
  }

  Container _buildMessageNoticeNumberWarpper() {
    return Container(
      margin: EdgeInsets.only(bottom: 100.h, left: 80),
      alignment: Alignment.center,
      // color: Colors.amber,
      // width: 120,
      child: Stack(
        children: [
          Container(
              margin: const EdgeInsets.only(top: 10, right: 10),
              child: Image.asset('assets/app/images/home/home_notice_bg1.png', width: 72.w)),
          Positioned(
            right: 5.w,
            child: Row(
              children: [
                Container(
                  // height: 22,
                  alignment: Alignment.center,
                  padding: const EdgeInsets.symmetric(horizontal: 3, vertical: 1),
                  decoration: BoxDecoration(color: const Color(0xFFE74C3C), borderRadius: BorderRadius.circular(15.r)),
                  child:
                      Text('99+', style: TextStyle(color: Colors.white, fontSize: 10.sp, fontWeight: FontWeight.bold)),
                ),
              ],
            ),
          )
        ],
      ),
    );
  }

  Container _buildMenuWarpper(double itemWidth) {
    double top = 28.h;
    return Container(
      margin: EdgeInsets.symmetric(horizontal: 16.w),
      color: Colors.transparent,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: [
          Stack(
            children: [
              Image.asset('assets/app/images/home/home_item_funny.png', width: itemWidth),
              Positioned(
                  top: top,
                  left: 19.w,
                  child:
                      Text('喵个趣', style: TextStyle(color: Colors.white, fontSize: 16.sp, fontWeight: FontWeight.bold))),
              Positioned(
                  top: top + 30.h,
                  left: 19.w,
                  child: Text('随机钓一下', style: TextStyle(color: Colors.white, fontSize: 10.sp))),
              Positioned(
                  bottom: 22.h,
                  left: 32.w,
                  child: Text('钓一下',
                      style: TextStyle(color: const Color(0xFF223781), fontSize: 14.sp, fontWeight: FontWeight.w600)))
            ],
          ).onTap(() {
            Get.to(const PondListPage());
          }),
          SizedBox(width: 14.w),
          Container(
            color: Colors.transparent,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                SizedBox(height: 18.h),
                Stack(
                  children: [
                    Image.asset('assets/app/images/home/home_item_video.png', width: itemWidth),
                    Positioned(
                        top: 10.h,
                        left: 16.h,
                        child: Text('喵个情',
                            style: TextStyle(color: Colors.white, fontSize: 16.sp, fontWeight: FontWeight.bold))),
                    Positioned(
                        bottom: 11.h,
                        left: 16.h,
                        child: Text('情绪漂流瓶', style: TextStyle(color: Colors.white, fontSize: 10.sp))),
                  ],
                ).onTap(() {
                  showModalBottomSheet(
                      context: context,
                      isScrollControlled: true,
                      builder: (_) {
                        return const PondPublishMianWidget();
                      });
                }),
                SizedBox(height: 14.h),
                Stack(
                  children: [
                    Image.asset('assets/app/images/home/home_item_audio.png', width: itemWidth),
                    Positioned(
                        top: 10.h,
                        left: 16.h,
                        child: Text('喵个声',
                            style: TextStyle(color: Colors.white, fontSize: 16.sp, fontWeight: FontWeight.bold))),
                    Positioned(
                        bottom: 11.h,
                        left: 16.h,
                        child: Text('语音匹配', style: TextStyle(color: Colors.white, fontSize: 10.sp))),
                  ],
                )
              ],
            ),
          ),
        ],
      ),
    );
  }

  Container _buildAppBarWarpper() {
    return Container(
      color: Colors.transparent,
      padding: const EdgeInsets.symmetric(horizontal: 16),
      height: 44,
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Container(width: 85),
          Image.asset('assets/app/images/home/home_app_bar_logo.png', width: 70),
          Container(
            width: 85,
            padding: const EdgeInsets.symmetric(vertical: 5),
            decoration: BoxDecoration(
                color: const Color(0xFF0C183A),
                borderRadius: BorderRadius.circular(20),
                gradient: const LinearGradient(colors: [Color(0xFF196C5B), Color(0xFF20157D)])),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Image.asset('assets/app/images/home/home_notice_icon.png', width: 25),
                const Text(' 喵个情', style: TextStyle(color: Colors.white, fontSize: 12))
              ],
            ),
          )
        ],
      ),
    );
  }
}
